<template name="rankstar">
	<view class="movie-score-wapper" v-if="starflag">
		<view class="">
			
			<image src="/static/full.png" class="star" v-for="it in starsnum.full"></image>
			<image src="/static/half.png" class="star" v-show="starsnum.half==1"></image>
			<image src="/static/kong.png" class="star" v-for="im in starsnum.kong"></image>
		</view>
		<view class="score" v-show="showNum==0">
			{{innerscore}}
		</view>
	</view>
	<view class="nonestar" v-else>
		暂无评分
	</view>
</template>

<script>
	export default {
		name:"rankstar",
		data() {
			return {
				starsnum:{
					full:0,
					half:0,
					kong:5
				},
				starflag : true
			};
		},
		created() {
			this.updatestars()
		},
			
		updated(){
			this.updatestars()
		},
		props:{
			innerscore:0 ,//定义外部传入的分数
			showNum:0   ,//是否要显示具体要得分的数
		},
			
		methods:{
			updatestars(){
				let score = this.innerscore
				
				if(score==0){
					this.starflag = false
					return
				}else {
					this.starsnum.half = score*10%5==0?0:1
					this.starsnum.full = Math.floor(score*10/10/2)
					this.starsnum.kong = 5 - this.starsnum.half-this.starsnum.full
				}
				
			}
		}
	}
</script>

<style>
 .movie-score-wapper{
		display: flex;
		justify-content: space-between;
	}	
 .movie-score-wapper .star{
		width: 28upx;
		height: 28upx;
		margin-top: 10upx;
	}
.movie-score-wapper .score{
		color: #808080;
		margin-left: 10upx;
	}
	
.nonestar{
	font-size: 14px
}
</style>
